<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>博客平台</title>
    <link rel="stylesheet" href="./reset.css">
    <link rel="stylesheet" href="./common.css">
    <link rel="stylesheet" href="./main.css">
</head>
<body>
    <div class="header">
        <div class="topbar wrapper">
            <div class="bar_left">
                <h1 class="logo">
                    <a href="#">博客平台</a>
                </h1>
            </div>
            <div class="bar_right">
                <input type="text">
                <div class="search">
                    <a href="#">
                        <img src="./博客平台/bg_search_submit.png" alt="搜索">
                    </a>
                </div>
                <div class="rss">
                    <a href="#">
                        <img src="./博客平台/rss.png" alt="rss">
                    </a>
                </div>
            </div>
        </div>
        <div class="navbar wrapper">
            <ul>
                <li><a href="#" class="hovering">Wopus首页</a>                   </li>
                <li>
                    <a href="#">基础知识</a>
                    <ul>
                        <li><a href="#">WP简介</a></li>
                        <li><a href="#">基础使用</a></li>
                        <li><a href="#">安装详解</a></li>
                        <li><a href="#">新手上路</a></li>
                        <li><a href="#">简单设置</a></li>
                    </ul></li>
                <li>
                    <a href="#">使用进阶</a>
                    <ul>
                        <li><a href="#">主题DIY</a></li>
                        <li><a href="#">主题制作</a></li>
                        <li><a href="#">主题汉化</a></li>
                        <li><a href="#">技术分享</a></li>
                        <li><a href="#">插件一族</a></li>
                        <li><a href="#">插件制作</a></li>
                        <li><a href="#">插件汉化</a></li>
                    </ul>
                </li>
                <li>
                    <a href="#">主题</a>
                    <ul>
                        <li><a href="#">一栏式</a></li>
                        <li><a href="#">二栏式</a></li>
                        <li><a href="#">三栏式</a></li>
                        <li><a href="#">四栏式</a></li>
                        <li><a href="#">混合式</a></li>
                    </ul>
                </li>
                <li>
                    <a href="#">插件</a>
                    <ul>
                        <li><a href="#">反垃圾类</a></li>
                        <li><a href="#">评论管理类</a></li>
                        <li><a href="#">RSS增强类</a></li>
                        <li><a href="#">文本编辑类</a></li>
                        <li><a href="#">广告管理类</a></li>
                        <li><a href="#">图片管理类</a></li>
                        <li><a href="#">标签管理类</a></li>
                    </ul>
                </li>
                <li>
                    <a href="#">博文精选</a>
                    <ul>
                        <li><a href="#">娱乐</a></li>
                        <li><a href="#">文化</a></li>
                        <li><a href="#">科技</a></li>
                        <li><a href="#">时事</a></li>
                        <li><a href="#">财经</a></li>
                        <li><a href="#">生活</a></li>
                    </ul>
                </li>
                <li>
                    <a href="#">博客主机</a>
                    <ul>
                        <li><a href="#">国内主机</a></li>
                        <li><a href="#">国外主机</a></li>
                        <li><a href="#">用户反馈</a></li>
                        <li><a href="#">域名常识</a></li>
                        <li><a href="#">主机常识</a></li>
                        <li><a href="#">免费空间</a></li>
                    </ul>
                </li>
                <li>
                    <a href="#">博客赚钱</a>
                    <ul>
                        <li><a href="#">买卖链接</a></li>
                        <li><a href="#">广告赚钱</a></li>
                        <li><a href="#">话题赚钱</a></li>
                    </ul>
                </li>
                <li>
                    <a href="#">博客聚会</a>
                    <ul>
                        <li><a href="#">世界</a></li>
                        <li><a href="#">中国</a></li>
                        <li><a href="#">Wopus机会</a></li>
                    </ul>
                </li>
                <li><a href="#">博客工具</a></li>
                <li><a href="#">Wopus论坛</a></li>
            </ul>
        </div>
    </div>
    <div class="ad wrapper">
        <img src="./博客平台/84dns.png" alt="光影互联">
        <div class="notice">
            <div class="icon">
                <h3>站内公告</h3>
            </div>
            <div class="main">
                <div class="item emphasize">
                    <a href="#">Wopus祝福各位新年快乐</a>
                </div>
                <div class="item">
                    <a href="#">Wopus淘宝店优惠码计划启动</a>
                </div>
                <div class="item">
                    <a href="#">Wopus淘宝店启用全新图片风格</a>
                </div>
                <div class="item emphasize">
                    <a href="#">WopusIDC主机淘宝客推广方法</a>
                </div>
            </div>
        </div>
    </div>
    <div class="container wrapper">
        <div class="left">
            <div class="new item_type_01">
                <h3>安全更新，WordPress 3.1.1发布</h3>
                <ul>
                    <li class="list"><a href="#">光影互联提供.so国际英文域名服务</a></li>
                    <li class="list"><a href="#">WordPress主题TwentyTen扩展版</a></li>
                    <li class="list"><a href="#">Theme Name: ecoNews</a></li>
                    <li class="list"><a href="#">WordPress主题: Anton</a></li>
                    <li class="list"><a href="#">光影互联提供特色后缀域名注册</a></li>
                    <li class="list"><a href="#">光影互联系列域名注册优惠公告</a></li>
                    <li class="list"><a href="#">解决Win主机重定向死循环问题</a></li>
                </ul>
            </div>
            <div class="item">
                <div class="box_title">
                    <div class="title_left">
                        <h3>基础知识</h3>
                    </div>
                    <div class="title_right">
                        <a href="#">简介</a>
                        <a href="#">丨</a>
                        <a href="#">安装</a>
                        <a href="#">丨</a>
                        <a href="#">设置</a>
                        <a href="#">丨</a>
                        <a href="#">新手上路</a>
                    </div>
                </div>
                <div class="box_body item_type_02">
                    <div class="main">
                        <div class="main_left">
                            <img src="./博客平台/wp30a.png" alt="WordPress">
                        </div>
                        <div class="main_right">
                            <div class="part">
                                <h3><a href="#">WordPress 3.0 RC版安装全解析</a></h3>
                            </div>
                            <div class="part">
                                <a href="" class="text"> 3.0 (WordPress3.0 RC 1发布)在功能上有了不</a>
                            </div>
                        </div>
                    </div>
                    <hr>
                    <div class="text">
                        <ul>
                            <li class="list"><a href="#">WordPress中文语言包使用教程</a></li>
                            <li class="list"><a href="#">WordPress清理wp_postmeta全攻略</a></li>
                            <li class="list"><a href="#">WordPress升级建议</a></li>
                            <li class="list"><a href="#">WordPress3.0来了，你的主题准备好了吗?</a></li>
                            <li class="list"><a href="#">WordPress插件安装全解析</a></li>
                        </ul>
                    </div>
                </div>
            </div>
            <div class="item">
                <div class="box_title">
                    <div class="title_left">
                        <h3>使用进阶</h3>
                    </div>
                    <div class="title_right">
                        <a href="#">主题相关</a>
                        <a href="#">丨</a>
                        <a href="#">插件一族</a>
                        <a href="#">丨</a>
                        <a href="#">主题DIY</a>
                    </div>
                </div>
                <div class="box_body item_type_02">
                    <div class="main">
                        <div class="main_left">
                            <img src="./博客平台/wp30b.png" alt="WordPress">
                        </div>
                        <div class="main_right">
                            <div class="part">
                                <h3><a href="#">WordPress技巧：彻底删除pingbacks</a></h3>
                            </div>
                            <div class="part">
                                <a href="" class="text">当其他博客在文章中有提到你的博客或者某一篇文章...</a>
                            </div>
                        </div>
                    </div>
                    <hr>
                    <div class="text">
                        <ul>
                            <li class="list"><a href="#">批量删除自定义栏目</a></li>
                            <li class="list"><a href="#">ScribeFire：博客离线发布工具</a></li>
                            <li class="list"><a href="#">直接从www.gravatar.com主站加载头像</a></li>
                            <li class="list"><a href="#">WordPress 3.0多站点功能解析(三)</a></li>
                            <li class="list"><a href="#">十大设计精美的基于WordPress的网站</a></li>
                        </ul>
                    </div>
                </div>
            </div>
            <div class="item">
                <div class="box_title">
                    <div class="title_left">
                        <h3>博客聚会</h3>
                    </div>
                    <div class="title_right">
                        <a class="emphasize" href="#">2009 WordCamp China</a>
                    </div>
                </div>
                <div class="box_body item_type_02">
                    <div class="main">
                        <div class="main_left">
                            <img src="./博客平台/wp30c.png" alt="WordCamp">
                        </div>
                        <div class="main_right">
                            <div class="part">
                                <h3><a href="#">WordCamp SF 2010 即将举行</a></h3>
                            </div>
                            <div class="part">
                               <a href="" class="text"> 美国当地时间5.1号，第四节WordCamp SF 2010将在洛</a>
                            </div>
                        </div>
                    </div>
                    <hr>
                    <div class="text">
                        <ul>
                            <li class="list"><a href="#">Wopus聚会礼品第二批开始派发</a></li>
                            <li class="list"><a href="#">Wopus周六聚会大图分享</a></li>
                            <li class="list"><a href="#">Wopus 2009 年底聚会现场</a></li>
                            <li class="list"><a href="#">WordPress北京非官方聚会邀请帖</a></li>
                            <li class="list"><a href="#">WordCamp:ORLANDO</a></li>
                        </ul>
                    </div>
                </div>
            </div>
            <div class="item">
                <div class="box_title">
                    <div class="title_left">
                        <h3>主机帮助</h3>
                    </div>
                    <div class="title_right">
                        <a href="#">主机常识</a>
                        <a href="#">丨</a>
                        <a href="#">账户管理</a>
                        <a href="#">丨</a>
                        <a href="#">高级技巧</a>
                    </div>
                </div>
                <div class="box_body1 item_type_04">
                    <div class="text">
                        <ul>
                            <li class="list"><a href="#">DA主机远程Mysq|数据库使用说明</a></li>
                            <li class="list"><a href="#">域名转出光影互联流程</a></li>
                            <li class="list"><a href="#">WopusIDC主机如何找到.htaccess文件</a></li>
                            <li class="list"><a href="#">WopusIDC主机如何找到.htaccess文件</a></li>
                            <li class="list"><a href="#">查看主机磁盘空间使用情况</a></li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
        <div class="center">
            <div class="radio">
                <ul class="image-list">
                    <li class="item">
                        <a href="#"><img src="./博客平台/wp31.jpg" alt=""></a>
                    </li>
                    <li class="item">
                        <a href="#"><img src="./博客平台/wordpresse7b3bbe58897e69bb4e696b0.jpg" alt=""></a>
                    </li>
                    <li class="item">
                        <a href="#"><img src="./博客平台/wopus-cpanel.jpg" alt=""></a>
                    </li>
                    <li class="item">
                        <a href="#"><img src="./博客平台/user.jpg" alt=""></a>
                    </li>
                </ul>
                <ul class="title-list">
                    <li class="item active">
                        <a href="#">1</a>
                    </li>
                    <li class="item">
                        <a href="#">2</a>
                    </li>
                    <li class="item">
                        <a href="#">3</a>
                    </li>
                    <li class="item">
                        <a href="#">4</a>
                    </li>
                    
                </ul>
            </div>
            <div class="item_01 item_type_03">
                <div class="box_title_01">
                    <div class="title_left_01 ">
                        <h3>WordPress咨询</h3>
                    </div>
                    <div class="title_right_01">
                        <a class="emphasize" href="#">WordPress 3.1</a>
                        <a href="#">丨</a>
                        <a href="#">最新动态</a>
                        <a href="#">丨</a>
                        <a href="#">发展建议</a>
                    </div>
                </div>
                <div class="pad">
                    <div div class="text">
                        <ul>
                        <li class="list"><a href="#" class="emphasize">WordPress 3.1中文语言包Wopus版</a></li>
                        <li class="list"><a href="#">WordPress 3.1正式版新功能解析</a></li>
                        <li class="list"><a href="#">WordPress 3.1命名由来</a></li>
                        <li class="list"><a href="#">WordPress 3.1正式版发布</a></li>
                        <li class="list"><a href="#">反垃圾评论插件Akismet更新到2.5.3</a></li>
                        <li class="list"><a href="#">安全更新，WordPress 3.0.5发布</a></li>
                        <li class="list"><a href="#">WordPress无所不能</a></li>
                        <li class="list"><a href="#">WordPress 3.1 RC2发布</a></li>
                        <li class="list"><a href="#">重要安全更新，WordPress 3.0.4发布</a></li>
                        </ul>
                    </div>
                </div>
            </div>
            <div class="item_01 item_type_03">
                <div class="box_title_01">
                    <div class="title_left_01 ">
                        <h3>主题推荐</h3>
                    </div>
                    <div class="title_right_01">
                        <a class="emphasize" href="#">主题完全翻译教程</a>
                        <a href="#">丨</a>
                        <a href="#">三栏主题</a>
                        <a href="#">丨</a>
                        <a href="#">CMS主题</a>
                        <a href="#">丨</a>
                        <a href="#">付费主题</a>
                    </div>
                </div>
                <div class="text">
                    <div class="pad">
                        <ul>
                            <li class="list"><a href="#">WordPress主题: Kryptonation</a></li>
                            <li class="list"><a href="#">WordPress主题: HabaneraMagazine</a></li>
                            <li class="list"><a href="#">WordPress主题: Quik</a></li>
                            <li class="list"><a href="#">国人主题: iNeo</a></li>
                            <li class="list"><a href="#">国人主题: Jauia's Debut</a></li>
                            <li class="list"><a href="#">国人主题: W1</a></li>
                            <li class="list"><a href="#">WordPress主题: Monte Cristo</a></li>
                            <li class="list"><a href="#">WordPress主题: Maximum</a></li>
                            <li class="list"><a href="#">国人主题: AsYLMF</a></li>
                        </ul>
                    </div>
                </div>
            </div>
            <div class="item_01 item_type_03">
                <div class="box_title_01">
                    <div class="title_left_01 ">
                        <h3>插件推荐</h3>
                    </div>
                    <div class="title_right_01">
                        <a href="#">反垃圾插件</a>
                        <a href="#">丨</a>
                        <a href="#">图片管理插件</a>
                        <a href="#">丨</a>
                        <a href="#">友情链接插件</a>
                    </div>
                </div>
                <div class="text">
                    <div class="pad">
                        <ul>
                            <li class="list"><a href="#">插件推荐: 无觅相关文章插件</a></li>
                            <li class="list"><a href="#">WP Super Cache更新支持WP 3.0</a></li>
                            <li class="list"><a href="#">WordPress相册插件: Overlay4WP</a></li>
                            <li class="list"><a href="#">实现WP完美摘要输出插件: Limit Posts</a></li>
                            <li class="list"><a href="#">插件控制Widget在页面显示</a></li>
                            <li class="list"><a href="#">WordPress淘宝客推广插件</a></li>
                            <li class="list"><a href="#">WP Super Cache使用全攻略</a></li>
                            <li class="list"><a href="#">CommentLuv 2.7简体中文化</a></li>
                            <li class="list"><a href="#">用Autoptimize插件给WP再提速</a></li>
                        </ul>
                    </div>
                </div>
            </div>
            <div class="item">
                <div class="box_title">
                    <div class="title_left">
                        <h3>博文精选</h3>
                    </div>
                    <div class="title_right">
                        <a href="#">科技</a>
                        <a href="#">丨</a>
                        <a href="#">文化</a>
                        <a href="#">丨</a>
                        <a href="#">娱乐</a>
                        <a href="#">丨</a>
                        <a href="#">时事</a>
                        <a href="#">丨</a>
                        <a href="#">财经</a>
                        <a href="#">丨</a>
                        <a href="#">生活</a>
                    </div>
                </div>
                <div class="box_body2 item_type_04">
                    <div class="text">
                        <ul>
                            <li class="list"><a href="#">Wopus继续发送Google Wave邀请</a></li>
                            <li class="list"><a href="#">Wopus开始放送Google Wave</a></li>
                            <li class="list"><a href="#">新网互联推出免费1G企业邮箱申请</a></li>
                            <li class="list"><a href="#">谷歌推域名解析服务Public DNS</a></li>
                            <li class="list"><a href="#">Google发布网站载入速度分析工具</a></li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
        <div class="right">
            <div class="download item_type_01 WP">
                <div class="dw">
                    <h3>WordPress 3.1</h3>
                </div>
                <div class="dw">
                    <a href="#">程序</a>
                    <span>|</span>
                    <a href="#">中文安装包</a>
                    <span>|</span>
                    <a href="#">语言包使用</a>
                </div>
            </div>
            <div class="download item_type_01 bP">
                <div class="dw">
                    <h3>bbPress1.02版</h3>
                </div>
                <div class="dw">
                    <a href="#">程序</a>
                    <span>|</span>
                    <a href="#">安装教程</a>
                </div>
            </div>
            <div class="item">
                <div class="box_title">
                    <div class="title_left">
                        <h3>WopusIDC</h3>
                    </div>
                    <div class="title_right">
                        <a class="emphasize" href="#">国际域名55元</a>
                    </div>
                </div>
                <div class="box_body2 item_type_02">
                    <div class="main">
                        <div class="main_left">
                            <img src="./博客平台/temp_90-60.png" alt="temp_90-60">
                        </div>
                        <div class="main_right_02">
                            <div class="part">
                                <h3><a href="#">WopusIDC电信服务器通知</a></h3>
                            </div>
                            <div class="part">
                                <a class="text" href="#">WopusIDC电信服务器(ip结尾：96.26)目前</a>
                            </div>
                        </div>
                    </div>
                    <hr>
                    <div class="text">
                        <ul>
                            <li class="list"><a href="#">WordPress中文语言包使用教程</a></li>
                            <li class="list"><a href="#">WordPress清理wp_postmeta全攻略</a></li>
                            <li class="list"><a href="#">WordPress升级建议</a></li>
                            <li class="list"><a href="#">WordPress3.0来了,你的主题准备了吗？</a></li>
                            <li class="list"><a href="#">WordPress插件安装全解析</a></li>
                        </ul>
                    </div>
                </div>
            </div>
            <div class="item">
                <div class="box_title">
                    <div class="title_left">
                        <h3>博客推荐</h3>
                    </div>
                    <div class="title_right">
                        <a class="emphasize" href="#">给Wopus投稿</a>
                    </div>
                </div>
                <div class="box_body3 item_type_02">
                    <div class="main">
                        <div class="main_left">
                            <img src="./博客平台/ixinxian_smaill.jpg" alt="爱新鲜">
                        </div>
                        <div class="main_right_02">
                            <div class="part1">
                                <h3><a href="#">爱新鲜</a></h3>
                            </div>
                            <div class="part2">
                                <a class="text" href="#">收集新鲜创意的玩意</a>。
                            </div>
                        </div>
                    </div>
                    <div class="main">
                        <div class="main_left">
                            <img src="./博客平台/download.jpg" alt="网管数据">
                        </div>
                        <div class="main_right_02">
                            <div class="part1">
                                <h3><a href="#">网管数据</a></h3>
                            </div>
                            <div class="part2">
                                <a class="text" href="#">专注网吧系统，网吧安全，为网吧网管一</a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="tool">
                <img src="./博客平台/250-100_tool_ad.png" alt="boke博客信息尽在掌握">
            </div>
            <div class="item">
                <div class="box_title">
                    <div class="title_left">
                        <h3>博客赚钱</h3>
                    </div>
                </div>
                <div class="box_body4 item_type_01">
                    <div class="main">
                        <div class="main_left">
                            <img src="./博客平台/temp_90-60.png" alt="temp_90-60">
                        </div>
                        <div class="main_right_02">
                            <div class="part">
                                <h3><a href="#">独立博客投放Google AdSense的几个原则</a></h3>
                            </div>
                            <div class="part">
                                <a class="text" href="#">昨天收到Google AdSense小组的邮件提</a>
                            </div>
                        </div>
                    </div>
                    <hr>
                    <div class="text">
                        <ul>
                            <li class="list"><a href="#">专访网赚高手JohnChow和Shoemoney</a></li>
                            <li class="list"><a href="#">谷歌中文网站管理员博客阅读笔记</a></li>
                            <li class="list"><a href="#">Google AdSense的六个优化技巧</a></li>
                            <li class="list"><a href="#">谷歌广告官方博客:博客中谷歌广告的禁</a></li>
                            <li class="list"><a href="#">警惕:几种赚不了钱的网络赚钱方法</a></li>
                        </ul>
                    </div>
                </div>
            </div>
            <div class="question">
                <img src="./博客平台/help_250.jpg" alt="帮忙">
            </div>
        </div>
    </div>
    <div class="link wrapper">
        <div class="box_title">
            <div class="title_left">
                <h3>友情链接</h3>
            </div>
            <div class="title_right">
                <a href="#" class="">友情链接</a>
                <span>要求PR > 5</span>
            </div>
        </div>
        <div class="box_body5 item_type_02">
                <div class="picture">
                    <img src="./博客平台/wopus.gif" alt="Wopus">
                    <img src="./博客平台/xianguo88.gif" alt="xianguo">
                    <img src="./博客平台/helloup_88x32.gif" alt="helloup">
                    <img src="./博客平台/385.png" alt="385">
                </div>
                <div class="website">
                    <ul>
                        <li><a href="#">终点科技网</a></li>
                        <li><a href="#">24Beta中文IT资讯</a></li>
                        <li><a href="#">糖果浏览器</a></li>
                        <li><a href="#">P.Linux</a></li>
                        <li><a href="#">Laboratory</a></li>
                        <li><a href="#">草根站长</a></li>
                        <li><a href="#">雅蛙网</a></li>
                        <li><a href="#">Leica中文摄影杂志</a></li>
                        <li><a href="#">黑莓时光</a></li>
                        <li><a href="#">中国WEB第一站</a></li>
                        <li><a href="#">中国莓</a></li>
                        <li><a href="#">Chrome迷</a></li>
                        <li><a href="#">手机元素</a></li>
                        <li><a href="#">百特传媒</a></li>
                    </ul>
                </div>
        </div>
    </div>
    <div class="foot">
        <div class="info wrapper">
            <div class="left">
                <span>©2011</span>
                <a href="#">Wopus中文博客平台.</a>
                <span>Powered by </span>
                <a href="#">WordPress.京ICP备09054226号</a>
            </div>
            <div class="right">
                <a href="#">Wopus简介</a>
                <span>丨</span>
                <a href="#">联系我们</a>
                <span>丨</span>
                <a href="#">合作伙伴</a>
                <span>丨</span>
                <a href="#">广告服务</a>
                <span>丨</span>
                <a href="#">投稿通道</a>
            </div>
        </div>
    </div>
    <script type="text/javascript" src="./script.js"></script>
</body>
</html>